Web Design, Website Design Services & SEO Web Design Blog

Home » Website Designing

15 exceptional education sites

Boston University

We start with Boston University’s website, which seems to be pretty traditional, but the more you poke your nose around, the more you realize they have done a great job at incorporating some of the modern web design standards. It’s a really, super clean approach to an education website, that still keeps it’s roots in what makes a traditional university site.

School of Visual Arts

Obviously, a school that specializes in visual arts cannot have a website that’s a complete eyesore. SVA does a great job of creating a site that first creates some excitement. The colors, the graphics, and photographs are all great, but what’s of great importance is the SVA layout. They don’t get right into how people should come to SVA, but they have a bunch of trending news articles on the visual arts and design community within SVA. That connection building is ideal for websites.

New York University

University websites are typically really busy and you have a lot of things pulling for your attention. NYU is another example of a university that decided to go really simple with their web design. The colors are cool and inviting and don’t seem to be extremely aggressive. They also do a good job of breaking up lots of long copy to make it easier to read and understand.

Biola Undergrad

This is completely unorthodox for a university website. As a matter of fact, it kind of feels like a museum or something. But what’s great is that the graphics speak tons for the creativity and exploration that you can get at Biola. The aesthetics of the site are so high so they’ve done a good job of balancing that with nice, small and easy to digest chunks of text as well. This is really another level of web design, let alone college web design.

Bates

What makes this website good is that the homepage is a slider for photographs. Of course, this links to different pages throughout the site. This is great because again, many traditional sites have so many things that are trying to get your attention that it’s just nice to go to a site and have control over what you see and what you don’t see. Also, the typography throughout the website is nothing to sneeze at!

Regent College

Simply put, this web design is beautiful. It’s captivating, interesting and absolutely makes me want to get a passport and travel to the campus in Canada. In all actuality, the layout isn’t too far from what you’d see anywhere else, but the graphics and aesthetic quality is just so high. The use of color and shapes plays a huge part in making Regent College’s web design so exceptional.

Drexel University

Drexel rather surprised me because in my familiarity with the school, it’s nothing to really write home about. But they did something really creative with their web design. It almost kind of reminds you of an agency’s website with the full image backgrounds. They do a great job of keeping it simple and streamlined, while heavily representing their schools’colors.

Langara

I saw this web design and almost lost my mind. This is a completely different approach to web design in general, but it absolutely works. There are so many small elements that you could easily look over, but would be missed if they weren’t there. This design exceptional and should be used for inspiration in all web design. I think they know what they’re doing up in Canada.

UCLA Architecture and Urban Design

Sometimes we use different design techniques because they’re trendy and other times we use them because they just make sense. In this case, everything on the UCLA AUD website makes sense. They have a grid-based system, which not only helps organize their work, but also kind of alludes to building stuff–like architects do! The use of color also helps organize things. Overall, you can just tell there was a lot of thinking and planning that went into this website for people who have to think and plan.

Rochester Institute of Technology – Visual Communication Design

Just like Drexel’s web design, this one puts you in the mind of a creative agency’s. And much like a creative agency, RIT used an extremely clean and simple approach to their design. If you browse through the site, there are different elements introduced that continue to keep your attention. This is absolutely important because they are trying to sell their visual communication to prospective students.

Strelka Institute

Strelka is not your typical undergrad or graduation institute of higher-learning. They are a non-profit organization aimed at educating students who want to use their talents and use them for the greater good. They deal with mainly creative students and get them to think about what’s next rather than what’s right now. Their website is bold yet simple in it’s approach, creating a genuine interest in the work they produce.

VCU Brandcenter

The Brandcenter is one of the top advertising graduate schools in the United States. They boast connections with some of the top agencies around today. Because of this, they have to make sure their image is in line with that. They have a really interesting visual brand that generates excitement and promotes creativity. Much like SVA’s site, they don’t concern you with why you should attend the Brandcenter. Instead, they focus on helpful videos and pieces of news for the community.

Williams College

According to Forbes, Williams College is the #2 College or University in the nation, right behind Princeton. Why is that important? Take a look at Princeton’s website, then take a look at Williams College’s. There’s a great difference in the role of design on these sites. Williams College actually seems like it might be fun to attend, and not your typical, boring private school. Kudos to them for stepping out the box a little!

Institute of Design at Stanford

The D School at Stanford has been making a little bit of noise lately with their academics and connections. They should also be recognized for this wonderful design they have. Everything is spot on from the graphical elements to the use of typography. This is another, all around solid web design.

Stanford Arts

Stanford twice? Well, they really know what they’re doing when it comes to design. In particular, on this site for the arts, they do a great job of fusing a traditional or typical university site design with some very new elements. In addition, when you browse around, they’ve done a great job of not making it salesy at all. As a matter of fact, looking at content on different pages is very similar to reading a blog or online magazine.

Read more…

Using Flat Design in Web and Print Projects

We’ve talked a lot here at webusabilityhelp about flat design – so you probably know what the trend is all about at this point.

The short version: Flat design is a style that does not use tricks or embellishments such as shadows, embossing or gradients to make elements look “real.” The design is characterized by a minimalistic style that uses color and typography in bold ways to create a distinct user experience.

That idea has been discussed in great detail for web projects – especially mobile apps – but not so much for when it comes to print design. And readers of this blog asked me about it on Twitter: How can you convert the flat style to print applications?

It’s easier than you might think.

Getting On-Trend

Why would you ever use flat design for both web and print design projects?

Because you like the look of flat design.
To brand materials in the same way for a consistent look.

Flat design is not brand new, even though it is very trendy right now. It is a concept that has come to the surface in many forms over the years. And it does work for a variety of projects.

In addition to web and application design, flat concepts have been used for quite some time on business cards, posters and even newspaper design. (Wall Street Journal above-the-fold promos often showcase the flat design style.)

Tips for Flat and Printing

There are a few considerations for printing using a flat design scheme – the difference in color, bleed from printing and overall vibrancy.

When translating a flat design from digital to print, colors have to be remixed for printing. Digital projects often use colors based on HEX or RGB values, while most printers prefer CMYK (cyan, magenta, yellow, black). CMYK printing uses four printer “plates” to create every color in the document and colors are mixed based on the four plate colors used.

When looking at a screen, very little consideration is given to bleed from one color to the next. In some instances colors can seem to mesh together a little, but this is a much more common problem when working with print materials. The darker a color, the more likely it is to bleed into a lighter color. The weight of the paper used also makes a big difference as well. Thinner paper types bleed much more than thicker, heavier-weight paper. This bleed is most commonly noticed when it affects the quality of type. If you are using a lot of ink (typically meaning use of a dark hue), make sure to use type that has a thicker, bolder stroke weight to absorb some of the potential ink bleed.

Finally, think about overall color vibrancy and selection. Digital display has a higher capacity to show more colors and variations in truer and sharper color than most standard printing (think posters and business cards). There is can be considerably less contrast between close shades when working with CMYK color (depending on the printing method). So you will likely not want to use both Amethyst and Wisteria from the Flat UI Color palette below in print because they may end up looking like the same color.

What Does This Mean for Flat Web Design?

If you are designing for digital only, all of these considerations mean nothing.

If your projects cross over between print and web, they are of utmost importance.

Web designers may find that they choose to use certain colors and tints because of cross-platform compatibility. Instead of matching colors with slight to moderate changes in color value, a designer may instead go bolder to create more contrast. This look might be easier to use in multiple mediums.

Font selection can also be impacted if a project will be used in print and web applications. For print, you must have a font to package, prep and print it. You can “borrow” fonts for use online from services such as Google Web Fonts, without having them installed on your computer. To maintain consistent font usage, a designer may look toward a different typeface they own for these projects.

In the end, designers must think about the complete package from start to finish. It can be quite difficult to convert a flat-designed website into a print counterpart after the fact, if print was never considered in the original plan.

Flat Colors as CMYK

Flat UI Colors is a fun little site that showcases 20 of the most popular hues in flat design right now. But the color swatches are only available in HEX and RGB.

We’ve converted each color to CMYK for you to use in print projects. Remember that projects come off different printing presses and from different printers in quite different ways, so make sure to adjust the color settings to best work with your printer.

A couple things to keep in mind when using these colors across platforms:

They will look slightly different from RGB to CMYK. These colors were created for flat digital design projects.

My suggestion? Use colors from the second and fourth rows for print projects.

The colors on these rows are a little more saturated and contain more colors from the CMYK mix. (Note all the zeroes in the first and third rows? That’s why for printing you will likely want to avoid those colors.)

Another tip? If you are planning to use white text, opt for a color with no black (K). If you are planning to use black (K) as the text color, use colors that contain black in the color mix. This can help keep print registration a little sharper.

Flat Fonts for Printing

Source: http://designmodo.com/flat-design-web-print/#ixzz2aVpOj9Z6

Read more…

20 Dextrous Adobe Illustrator Logo Design Tutorials

Your logo or brand is your visual identity it gives you an individualism. We can easily recollect a name of a Brand just by looking at the logo. Logos are mostly created in Illustrator.

We have placed few Tutorials based on Logo Designing in Adobe Illustrator that will not only give you the details of the Illustrator process but few of them even give you the insight of Logo Design. We would be happy to see if you also designed a logo by taking an inspiration from any of these tutorials or even if you have used your own creative instincts.